import React from 'react';
import { Form, Input, Button, message, Select, Space, Tooltip, Row, Col, Alert } from 'antd';
import { connect } from 'umi';
import IconFont from '@/components/Iconfont';

class UnionpayOption extends React.Component<any, any> {
    constructor(props: any) {
        super(props);
        this.state = {
            loading: false,
            visible: false,
        }
    }
    formRef: any = React.createRef();
    componentDidMount() {
        this.getData(this.props.record.appID, this.props.record.payChanelIndex);
    }
    onFinish = (values: any) => {
        this.setState({ loading: true });
        var datas = this.props.record;
        datas.ParamSetting = JSON.stringify(values.model);
        this.props.dispatch({
            type: "Abp/update",
            payload: datas,
            control: 'UserPayChanel',
        }).then(() => {
            var resp = this.props.response;
            if (resp.success) {
                message.success('保存成功！');
                this.setState({ loading: false });
            }
            else {
                message.error('保存错误，请联系管理员');
            }
        });
    }
    getData = (appId: string, optType: string) => {
        const { dispatch } = this.props;
        if (appId && optType) {
            dispatch({
                type: 'Abp/getOptsAsync',
                payload: { appId, optType },
                control: 'UserPayChanel',
            }).then(() => {
                var result = this.props.response.result?.params;
                this.setState({ record: result });
                this.formRef.current.setFieldsValue({ model: result });
            });
        }
    }
    onClose = () => {
        //this.props.closeDraw();
    };
    render() {
        return (
            <Form
                layout='vertical'
                ref={this.formRef} onFinish={this.onFinish}
            >
                <Row gutter={[16, 16]}>
                    <Col span={12}>
                        <Form.Item label={<span>商户号 <Tooltip title="已被批准加入银联互联网系统的商户代码 固定15位长，仅支持数字和字母"><IconFont type="icon-wenhao" /></Tooltip></span>} name={['model', 'merId']} rules={[{ required: true, message: "商户号必填" }]}>
                            <Input placeholder="商户号" />
                        </Form.Item>
                        <Form.Item label="accessType" name={['model', 'accessType']} rules={[{ required: true, message: "accessType必填" }]}>
                            <Input placeholder="accessType" />
                        </Form.Item>
                        <Form.Item label="签约版本" name={['model', 'version']}>
                            <Input />
                        </Form.Item>
                        <Form.Item
                            label={<span>签名方法 <Tooltip title="RSA-SHA256：表示采用RSA签名，摘要算法用SHA256"><IconFont type="icon-wenhao" /></Tooltip></span>}
                            name={['model', 'signMethod']}>
                            <Select placeholder="SHA256">
                                <Select.Option value="RSA-SHA256">RSA-SHA256</Select.Option>
                                <Select.Option value="SHA256">SHA256</Select.Option>
                            </Select>
                        </Form.Item>

                        <Form.Item label="signCert" name={['model', 'signCert']} rules={[{ required: true, message: "signCert" }]}>
                            <Input placeholder="signCert" />
                        </Form.Item>
                        <Form.Item label="signCertPassword" name={['model', 'signCertPassword']}>
                            <Input.Password />
                        </Form.Item>
                    </Col>
                    <Col span={12}>

                        <Form.Item label="EncryptCert" name={['model', 'encryptCert']}>
                            <Input />
                        </Form.Item>
                        <Form.Item label="MiddleCert" name={['model', 'middleCert']}>
                            <Input />
                        </Form.Item>
                        <Form.Item label="rootCert" name={['model', 'rootCert']}>
                            <Input />
                        </Form.Item>
                        <Form.Item label="secureKey" name={['model', 'secureKey']}>
                            <Input />
                        </Form.Item>
                        <Form.Item label="testMode" name={['model', 'testMode']}>
                            <Input />
                        </Form.Item>

                    </Col>
                </Row>
                <Form.Item>
                    <Space>
                        <Button type="primary" htmlType="submit" loading={this.state.loading}>保存</Button>
                        <Button onClick={this.onClose}>取消</Button>
                    </Space>
                </Form.Item>
            </Form>
        )
    }
}
export default connect(({ Abp }: API.IConnectState) => ({
    response: Abp.response,
}))(UnionpayOption);